<template>
	<view class="content">
		<view class="no-user" v-if="!data[0]">
			<view class="item">
				暂时没有申请呢~请耐心等待~
			</view>
		</view>
		<view class="box">
			<view class="item" v-for="(item,index) in data" :key="index">
				<view class="left-box">
					<view class="name">
						{{item.name}}
					</view>
					<view class="neirong">
						{{item.neirong}}
					</view>
				</view>
				<view class="btn-box">
					<view class="btn" @click="checkShenqingTrue(item.shenqing_id)">
						同意
					</view>
					<view class="btn" @click="checkShenqingFalse(item.shenqing_id)">
						拒绝
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import {
		ref,
		reactive
	} from 'vue'

	import {
		getUserOpenid
	} from '@/tools/tools.js'

	import {
		getShgenqingList,
		checkBtnTrue,
		checkBtnFalse
	} from '@/api/yaoyue_api.js'

	const data = ref([])
	const openid = ref('')
	const _getShgenqingList = () => {

		getShgenqingList(openid.value).then((res) => {
			console.log(res);
			data.value = res.result
			uni.hideLoading()
		})
	}

	// 同意
	const checkShenqingTrue = (id) => {
		uni.showModal({
			title: '提示',
			content: '同意申请吗？',
			success(check) {
				if (check.confirm) {
					checkBtnTrue(id).then((res2) => {
						uni.showToast({
							title:'已通过'
						})
						setTimeout(() => {
							_getShgenqingList()
						}, 500)
					})
				}
			}
		})
	}
	// 拒绝
	const checkShenqingFalse = (id) => {
		uni.showModal({
			title: '提示',
			content: '拒绝申请吗？',
			success(check) {
				if (check.confirm) {
					checkBtnFalse(id).then((res2) => {
						uni.showToast({
							title:'已拒绝'
						})
						setTimeout(() => {
							_getShgenqingList()
						}, 500)
					})
				}
			}
		})
	}



	onLoad(() => {
		uni.showLoading()
		uni.getStorage({
			key: 'openid',
			success(res) {
				openid.value = res.data.openid
				_getShgenqingList()
			}
		})
	})
</script>

<style lang="scss" scoped>
	.content {
		min-height: 100vh;
		background-color: #f5f5f6;
		
		.no-user {
			height: 100vh;
			display: flex;
			justify-content: center;
			flex-direction: column;
			text-align: center;
		}
		.box {
			padding: 20rpx;

			.item {
				width: calc(100vw - 80rpx);
				padding: 20rpx;
				border-radius: 20rpx;
				background-color: white;
				display: flex;
				justify-content: space-between;
				margin-bottom: 20rpx;

				.left-box {
					.name {
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;
						width: 41 0rpx;
					}

					.neirong {
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;
						width: 410rpx;
					}

				}

				.btn-box {
					display: flex;

					.btn {
						padding: 20rpx;
						background-color: #53c3ff;
						color: white;
						margin-left: 10rpx;
						border-radius: 10rpx;
					}
				}
			}
		}
	}
</style>